{include file="public/head"}
<style>
    .header{
        width: 100%;
    }

    .header .title{
        width: 100%;
        padding: 2rem 0 1rem 2rem;
        font-size: 1rem;
    }

    .header .centent {
        padding: 1rem 0 1rem 2rem;
        font-size: 1.4rem;
    }

    .header .centent input {
        outline: none;
        border: none;
        font-size: 1.7rem;
    }

    .header .other {
        padding: .5rem 0 1rem 2rem;
        font-size: .8rem;
    }

    .header .other input {
        outline: none;
        border: none;
        border-bottom: 1px solid black;
        margin-left: 1rem;
    }

    .header .tips {
        padding: .5rem 0 1rem 2rem;
        font-size: .5rem;
        color: silver;
    }

    .list{
        width: 100%;
        height: 15.5rem;
        padding: 1rem;
    }

    .list ul:first-child{
        height: 1.5rem;
        line-height: 1.5rem;
        overflow: hidden;
    }

    .list ul:last-child{
        height: calc(100% - 1.5rem);
        overflow-y: scroll;
    }

    .list li{
        display: flex;
        justify-content: space-between;
        align-items: center;
        line-height: 2;
        font-size: 14px;
    }

    .list li span {
        width: 25%;
        display: inline-block;
    }

    .list li span:last-child{
        text-align: right;
    }

    .list li span:nth-child(2) {
        text-align: center;
    }

    .list li span:nth-child(3) {
        text-align: center;
    }

    .list .top {
        font-weight: 700;
    }

    .sub{
        width: 95%;
        background-color: #f23030;
        border: none;
        border-radius: .1rem;
        font-weight: 600;
        color:white;
        margin: 2rem 0 1rem 2.5%;
        padding: .5rem;
    }
    .zfpassword{
        margin: 1rem;
    }
    .zfpassword input{
        border: 1px solid #000;
        border-radius:3px;
        padding: .5rem 0;
        width: 100%;
    }
    .layui-layer-btn{
        display: flex;
        justify-content: space-between;
    }
</style>
<body>

<header class="aui-header-default aui-header-fixed aui-header-bg">
    <a href="javascript:history.back(-1)" class="aui-header-item">
        <i class="aui-icon aui-icon-back-white"></i>
    </a>
    <div class="aui-header-center aui-header-center-clear">
        <div class="aui-header-center-logo">
            <div class="aui-car-white-Typeface" style="color:black;font-weight: bold;">积分转账</div>
        </div>
    </div>
    <a href="#" class="aui-header-item-icon"   style="min-width:0">
<!--        <i class="aui-icon aui-icon-member"></i>-->
    </a>
</header>

<section class="aui-settle-content">
    <div class="header">
        <div class="title">转账数量</div>
        <div class="centent">
            <span>￥</span>
            <input type="text" id="num" placeholder="0.00" onkeyup="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : ''"/>
        </div>
        <div class="other">
            <span>收款账号</span><input type="text" id="username" placeholder="请输入收款账号"/>
            <span style="background-color: #f23030;padding: .1rem .2rem;color:white;border-radius: 2px" id="check_user">验证姓名</span>
        </div>
        <!--<div class="other">-->
        <!--    <span>手机号</span><input type="text" id="phone" placeholder="请输入手机号码"/>-->
        <!--</div>-->
        <div class="other">
            <span>验证码</span><input type="text" id="code" placeholder="请输入验证码"/>
            <span style="background-color: #f23030;padding: .1rem .2rem;color:white;border-radius: 2px" id="send">发送</span>
        </div>
        <div class="tips">转账手续费：{$Config.transfer_fees*100}%</div>
    </div>
    <div class="aui-dri"></div>
    <div class="aui-settle-choice">
        <div class="aui-settle-ways">
            选择转账类型
        </div>
<!--        <a href="javascript:" class="aui-address-cell  aui-fl-arrow-clear">-->
<!--            <div class="aui-address-cell-hd">-->
<!--                <img src="__STATIC__/User/img/icon/reward.png" alt="">-->
<!--            </div>-->
<!--            <div class="aui-address-cell-bd">-->
<!--                余额-->
<!--                <p>￥{$UserInfo.balance_4}</p>-->
<!--            </div>-->
<!--            <div class="aui-address-cell-ft"><input type="radio" name="type" value="4" class="check check-pay goods-check goodsCheck" checked="checked"></div>-->
<!--        </a>-->

        <a href="javascript:" class="aui-address-cell  aui-fl-arrow-clear">
            <div class="aui-address-cell-hd">
                <img src="__STATIC__/User/img/icon/reward.png" alt="">
            </div>
            <div class="aui-address-cell-bd">
                积分
                <p>￥{$UserInfo.balance_1}</p>
            </div>
            <div class="aui-address-cell-ft"><input type="radio" name="type" value="1" class="check check-pay goods-check goodsCheck"></div>
        </a>
        <!--<a href="javascript:" class="aui-address-cell  aui-fl-arrow-clear">-->
            <!--<div class="aui-address-cell-hd">-->
                <!--<img src="__STATIC__/User/img/icon/point.png" alt="">-->
            <!--</div>-->
            <!--<div class="aui-address-cell-bd">-->
                <!--炁点余额-->
                <!--<p>{$UserInfo.balance_2}</p>-->
            <!--</div>-->
            <!--<div class="aui-address-cell-ft"><input type="radio" name="type" value="2" class="check check-pay goods-check goodsCheck" ></div>-->
        <!--</a>-->
        <!--<a href="javascript:" class="aui-address-cell  aui-fl-arrow-clear">-->
            <!--<div class="aui-address-cell-hd">-->
                <!--<img src="__STATIC__/User/img/icon/shares.png" alt="">-->
            <!--</div>-->
            <!--<div class="aui-address-cell-bd">-->
                <!--股权-->
                <!--<p>{$UserInfo.balance_3}</p>-->
            <!--</div>-->
            <!--<div class="aui-address-cell-ft"><input type="radio" name="type" value="3" class="check check-pay goods-check goodsCheck"></div>-->
        <!--</a>-->
    </div>
    <input type="submit" class="sub" value="确认转账">
    <div class="list">
        <ul class="top">
            <li>
                <span>账号</span>
                <span>金额</span>
                <span>时间</span>
                <span>进/出</span>
            </li>
        </ul>
        <ul>
            {volist name="FinanceList" id="v"}
            <li>
                <span>{$v.username}</span>
                <span>{$v.num}</span>
                <span>{$v.add_time|date="m-d H:i",###}</span>
                {if condition="$v.reward_type eq 7"}<span style="color:red">转出</span>
                {elseif condition="$v.reward_type eq 8"}<span style="color:green">转进</span>
                {/if}
            </li>
            {/volist}
        </ul>
    </div>
</section>
<script type="text/javascript" src="__STATIC__/User/js/jquery.min.js"></script>
<script type="text/javascript" src="__STATIC__/Admin/layer/layer.js"></script>
<script>
    $(function () {
        $("#check_user").click(function () {
            var username = $("#username").val();
            if (username == "") {
                alert('请输入收款账号');
                return false;
            }

            $.ajax({
                type: "POST",
                url: "{:url('User/CheckUser')}",
                data: {
                    username: username,
                },
                dataType: "json",
                success: function (data) {
                    alert(data.message);
                }
            })


        })
        
        
        var flag;
        var flag1 = true;
        //发送验证吗
        $("#send").on('click',function(){
            //判断有无手机号
            if(!'{$UserInfo.phone}'){
                layer.open({
                    type: 1,
                    title: '请输入手机号码(用于接收验证码)',
                    area: ["80%", "9.5rem"],
                    closeBtn: 1,
                    // skin: 'layui-layer-lan'
                    content: '<div class="zfpassword"><input type="text" id="phone"></div>',
                    btn:['确定','取消'],
                    yes:function() {
                        var phone = $("#phone").val();
                            $.ajax({
                                type: "POST",
                                url: "{:url('User/addphone')}",
                                data: {
                                    phone: phone,
                                },
                                dataType: "json",
                                success: function (data) {
                                    if (data.status == 1) {
                                        alert(data.message);
                                        window.location.reload();
                                    } else {
                                        alert(data.message);
                                        return false;
                                    }
                                }
                            })
                    }
    
                })
                return false;
            }
            
            
            
            
            if(flag1) {
                flag1 = false
                var phone = '{$UserInfo.phone}';

                if(phone == ""){
                    alert('请输入手机号');
                    return false;
                }else if(!(/^1[3456789]\d{9}$/.test(phone))){
                    alert('手机号码格式错误')
                    return false;
                }

                $.ajax({
                    type:"POST",
                    url:"{:url('Open/SendCode')}",
                    data:{
                        phone:phone,
                    },
                    dataType:"json",
                    success:function(data){
                        console.log(data)
                        if(data.status == 1){
                            alert(data.message);
                            var time = 60;
                            var interval = setInterval(function(){
                                time -= 1;
                                $("#send").text(`剩余时间${time}`);
                                if(time == 0){
                                    clearInterval(interval)
                                    $("#send").text('重新发送');
                                    flag1 = true
                                }
                            },1000)
                        }else{
                            alert(data.message);
                        }
                    }
                });
            }
        })
        

        $(".sub").on('click', function () {
            var num = $("#num").val();
            var username = $("#username").val();
            var phone = '{$UserInfo.phone}';
            var code = $("#code").val();
            var type = $("input[name='type']:checked").val();
            if (num <= 0 || num == "") {
                alert('请输入转账金额');
                return false;
            }

            if (username == "") {
                alert('请输入收款账号');
                return false;
            }
            
            if (code == "") {
                alert('请输入验证码');
                return false;
            }

            layer.open({
                type: 1,
                title: '请输入支付密码',
                area: ["80%", "9.5rem"],
                closeBtn: 1,
                // skin: 'layui-layer-lan'
                content: '<div class="zfpassword"><input type="password" id="paypassword"></div>',
                btn:['确定','取消'],
                yes:function() {
                    var password = $('#paypassword').val();
                        $.ajax({
                            type: "POST",
                            url: "{:url('User/UserTransfer')}",
                            data: {
                                num: num,
                                username: username,
                                type: type,
                                phone: phone,
                                code: code,
                                password: password
                            },
                            dataType: "json",
                            success: function (data) {
                                if (data.status == 1) {
                                    alert(data.message);
                                    window.location.reload();
                                } else {
                                    alert(data.message);
                                }
                            }
                        })
                }

            })
        })
    })
</script>
</body>
</html>